<template>
  <div>
    <table-box ref="tableBox" no-request show-index show-selection :other-filters="comFiltersRaw" :other-raw="comParamsRaw" :table-config="tableConfig" @selection-change="handleSelectionChange" @btnOperate="handleBtnOperate" />
    <export-files
      v-if="exportisible"
      title="导出"
      :visible.sync="exportisible"
      download-url=""
      download-prefix=""
      :config="exportConfig"
      :success-fun="(config,res)=>{}"
      @success="handleExportSuccess"
    />
    <!-- <PersonChange ref="audit" :rows="selectedRows" @on-success="()=>refreshTableBoxData('onPage')" /> -->
  </div>
</template>
<script>
// import PersonChange from './PersonChange'
import { getToken } from '@/utils/auth'
import { parseTime } from '@/utils'
export default {
  name: 'Table',
  components: {
    // PersonChange
  },
  props: {
    filtersRaw: {
      type: Array,
      default: () => []
    },
    paramsRaw: {
      type: Object,
      default: () => ({})
    },
    fixedFiltersRaw: {
      type: Array,
      default: () => []
    },
    fixedParamsRaw: {
      type: Array,
      default: () => []
    },
    tableIndex: {
      type: Number,
      default: 1
    },
    buttonGroupCode: {
      type: String,
      default: 'default'
    }
  },
  data() {
    return {
      tableConfig: {
        interfacePath: `${process.env.VUE_APP_BASE_API}/api/v1/ctmShopBuildWeeklyTaskFollowUp/page`,
        hideSearchBar: true,
        tabIndex: 1,
        // sort: 'lastUpdateTime',
        // order: 'DESC',
        // 优先按办事处编码正序->市场编码倒序->创建时间倒序—>客户经理；
        sortersRow: [
          { 'id': 'agencyCode', 'property': 'agencyCode', 'direction': 'ASC' },
          { 'id': 'marketCode', 'property': 'marketCode', 'direction': 'DESC' },
          { 'id': 'createTime', 'property': 'createTime', 'direction': 'DESC' },
          { 'id': 'responsibleCode', 'property': 'responsibleCode', 'direction': 'ASC' }
        ],
        setting: [
          {
            prop: 'taskCode',
            label: '门店升级跟进任务号',
            className: 'btn-green',
            minWidth: 160,
            isButton: true,
            clickFun: this.toDetail
          },
          {
            prop: 'marketCode',
            label: '市场编码',
            minWidth: 120
          },
          {
            prop: 'marketName',
            label: '市场名称',
            minWidth: 120
          },
          {
            prop: 'marketType',
            label: '市场类型',
            minWidth: 120,
            propEnum: {
              appCode: 'slm',
              domainCode: 'marketing',
              dictTypeCode: 'TOBE_MARKET_TYPE'
            }
          },
          {
            prop: 'agencyName',
            label: '所属办事处',
            minWidth: 120
          },
          {
            prop: 'responsibleCode',
            label: '责任人编码',
            minWidth: 120
          },
          {
            prop: 'responsibleName',
            label: '责任人姓名',
            minWidth: 130
          },
          {
            prop: 'createTime',
            label: '创建日期',
            minWidth: 140
          },
          {
            prop: 'weekNumber',
            label: '周数',
            minWidth: 100
          },
          {
            prop: 'maintenanceStage',
            label: '跟进状态维护进度',
            minWidth: 160,
            propEnum: {
              appCode: 'slm',
              domainCode: 'marketing',
              dictTypeCode: 'CTM_MARKET_BUID_WEEK_MAINTENANCE_PROGRESS'
            }
          },
          {
            prop: 'isProgress',
            label: '是否有进展',
            minWidth: 130,
            propEnum: {
              appCode: 'slm',
              domainCode: 'marketing',
              dictTypeCode: 'BOOLEANS'
            }
          },
          {
            prop: 'progressStage',
            label: '进展程度',
            minWidth: 120,
            propEnum: {
              appCode: 'slm',
              domainCode: 'marketing',
              dictTypeCode: 'CTM_MARKET_BUID_FOLLOW_UP_PROGRESS'
            }
          },
          {
            prop: 'isIntendedDealer',
            label: '是否有意向商家',
            minWidth: 150,
            propEnum: {
              appCode: 'slm',
              domainCode: 'marketing',
              dictTypeCode: 'BOOLEANS'
            }
          },
          {
            prop: 'estimatedSurveyTime',
            label: '预计测绘时间',
            minWidth: 140,
            formatData: v => {
              return parseTime(v.estimatedSurveyTime, '{y}-{m}-{d}')
            }
          },
          {
            prop: 'estimatedDrawingTime',
            label: '预计报图时间',
            minWidth: 140,
            formatData: v => {
              return parseTime(v.estimatedDrawingTime, '{y}-{m}-{d}')
            }
          },
          {
            prop: 'remark',
            label: '跟进说明',
            minWidth: 160
          }
        ],
        btnList: process.env.NODE_ENV === 'development' ? [
          { buttonName: '编辑', optCode: 'edit', outerFlag: true },
          { buttonName: '审核', optCode: 'audit', outerFlag: true },
          { buttonName: '导出', optCode: 'export', outerFlag: true }
        ] : null
      },
      exportisible: false,
      selectedRows: []
    }
  },
  computed: {
    exportConfig() {
      return [
        {
          code: '1',
          name: '市场开发-升级周进度跟进',
          async: false, // 同步导出数据
          templateCode: '', // 模板code
          dataApi: `${process.env.VUE_APP_BASE_API}/api/v1/ctmShopBuildWeeklyTaskFollowUp/export`, // 数据导出api
          headers: { token: getToken() },
          filtersRaw: this.comFiltersRaw, // 符合当前查询条件的所有数据行的导出条件(当前数据查询结果对应的条件)
          paramsRaw: this.comParamsRaw,
          sort: 'lastUpdateTime', // 排序字段
          order: 'desc', // 排序方式
          selectedRows: this.selectedRows, // 当前所选中的数据行
          queryField: ''// 指定行导出时使用的查询字段名称
        }
      ]
    },
    comFiltersRaw() {
      return [...this.filtersRaw, ...this.fixedFiltersRaw]
    },
    comParamsRaw() {
      return { ...this.paramsRaw, ...this.fixedParamsRaw }
    }
  },
  created() {
    this.$set(this.tableConfig, 'tableIndex', this.tableIndex)
    this.$set(this.tableConfig, 'buttonGroupCode', this.buttonGroupCode)
  },
  mounted() {
    this.refreshTableBoxData()
  },
  methods: {
    refreshTableBoxData(flag) {
      this.$refs.tableBox && this.$refs.tableBox.initTableData(flag)
    },
    refreshTableHeight() {
      this.$refs.tableBox && this.$refs.tableBox.refreshTableHeight()
    },
    handleSelectionChange(rows) {
      this.selectedRows = rows
    },
    handleBtnOperate(flag) {
      this[flag] && this[flag]()
    },
    edit() {
      if (!this.singleJudge(this.selectedRows, '编辑', true)) {
        return
      }
      this.$pageStack.push('src/views/channelTask2/storeUpgrade/weekTask/components/Edit.vue', {
        props: {
          id: this.selectedRows[0].id
        }
      }, (flag) => {
        flag && this.refreshTableBoxData(flag)
      })
    },
    toDetail(row) {
      this.$pageStack.push('src/views/channelTask2/storeUpgrade/weekTask/components/detail.vue', {
        props: {
          id: row.id
        }
      })
    },
    export() {
      this.exportisible = true
    },
    audit() {
      if (!this.singleJudge(this.selectedRows, '审核', true)) {
        return
      }
      this.$pageStack.push('src/views/channelTask2/storeUpgrade/weekTask/components/Audit.vue', {
        props: {
          id: this.selectedRows[0].id
        }
      }, (flag) => {
        flag && this.refreshTableBoxData(flag)
      })
    },
    handleExportSuccess() {

    }
  }
}
</script>
